<div style="padding: 10px 50px">
	<form class="form-horizontal" role="form">
		<div class="form-group">
			<div class="col-sm-10">
				<h3>
					<span class="label label-default">&nbsp;&nbsp;&nbsp;Project
						&nbsp;&nbsp;&nbsp;</span>
				</h3>
			</div>
		</div>

		<div class="form-group">
			<label class="col-sm-2 control-label">project name</label>
			<div class="col-sm-8">
				<input type="text" class="form-control" id="projectName"
					placeholder="项目名称">
			</div>
		</div>

		<div class="form-group">
			<label class="col-sm-2 control-label">version</label>
			<div class="col-sm-8">
				<input type="text" class="form-control" id="version"
					placeholder="项目版本号">
			</div>
		</div>

		<div class="form-group">
			<label class="col-sm-2 control-label">author</label>
			<div class="col-sm-8">
				<input type="text" class="form-control" id="author"
					placeholder="所有人">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-2 control-label">kubernete version</label>
			<div class="col-sm-8">
				<input type="text" class="form-control" id="kuberneteVersion"
					placeholder="kubernete版本">
			</div>
		</div>

		<div class="form-group">
			<label class="col-sm-2 control-label">describe</label>
			<div class="col-sm-8">
				<input type="text" class="form-control" id="describe"
					placeholder="描述">
			</div>
		</div>
		<!-- service -->

		<div class="form-group panel-group" name="service">
			<div class="panel panel-info">
				<div class="panel-heading">
					Service
					
					<button type="button" class="btn btn-primary" onclick="del(this)">-</button>
					<button type="button" class="btn btn-primary"
						data-parent="#selector" data-toggle="collapse"
						data-target="#service_panel_0" onclick="hide_show(this)">></button>
				</div>
				<div class="panel-body" id="service_panel_0"></div>
			</div>
		</div>

	</form>

	<div class="modal-footer">
	<button type="button" class="btn btn-primary" onclick="add()">添加服务</button>
		<button onclick="return false;" type="button" class="btn btn-primary">
			保<span style="padding-left: 12px" />存
		</button>
		<button onclick="return false;" type="button" class="btn btn-primary">
			保存并发布
		</button>
		<button type="button" class="btn btn-default" data-dismiss="modal"
			onclick="back()">
			返<span style="padding-left: 12px" />回
		</button>

	</div>

</div>

<script>
function buildJson()
{
	/*
	var $json=$proObj.clone();
	$json.projectName=$("#projectName").val();
	$json.version=$("#version").val();
	$json.author=$("#author").val();
	$json.kuberneteVersion=$("#kuberneteVersion").val();
	$json.describe=$("#describe").val();
	//get all service
	var $services = $("div[name='servicePanel']");
	
	for(int i=0;i<$services.length;i++)
	{
		var $service =$services.eq(i);
		
		
		
	}
	*/
	
	
}


	$(function() {
		loadData();

	})
	function loadData() {
		$("#service_panel_0").load("./service_project.html?d1=112");
		$('#service_panel_0').toggle(1000);
		
		$("#projectName").val($proObj.projectName);
		$("#version").val($proObj.version);
		$("#author").val($proObj.author);
		$("#kuberneteVersion").val($proObj.kuberneteVersion);
		$("#describe").val($proObj.describe);

	}

	function hide_show(obj) {
		$ob = $(obj);
		$($ob.attr("data-target")).toggle(1000);
	}
	function back() {
		$('.content').load('project_main.html');
	}

	function add() {
		var $services = $(".form-group[name='service']");
		if ($services.length > 0) {
			var $service = $services.eq(0);
			var $new_service = $service.clone();
			var id = $services.length + 1;
			$new_service.children("div").children(".panel-heading").children(
					"button").attr("data-target", "#service_panel_" + id);
			$new_service.children("div").children(".panel-body").attr("id",
					"service_panel_" + id);
			$service.after($new_service);
		}
	}

	function del(obj) {
		var $services = $(".form-group[name='service']");
		
		if ($services.length > 1) {
			$(obj).parent().parent().parent().remove();
		}
	}
</script>